{% extends "base.html" %}
{% load static %}

{% block title %}汉典制药{% endblock title %}

{% block content %}
  <!-- Start Banner     ============================================= -->
  <div class="banner-area heading-exchange text-dark">
    <div id="bootcarousel" class="carousel inc-top-heading slide carousel-fade animate_text" data-ride="carousel">
      <!-- Wrapper for slides -->
      <div class="carousel-inner carousel-zoom">
        <div class="item active">
          <div class="slider-thumb bg-cover" style="background-image: url({% static 'assets/img/banner/1.jpg' %});"></div>
        </div>
        <div class="item">
          <div class="slider-thumb bg-cover" style="background-image: url({% static 'assets/img/banner/3.jpg' %});"></div>
        </div>
        <div class="item">
          <div class="slider-thumb bg-cover" style="background-image: url({% static 'assets/img/banner/2.jpg' %});"></div>
        </div>
      </div>
      <!-- End Wrapper for slides -->
      <!-- Left and right controls -->
      <a class="left carousel-control" href="#bootcarousel" data-slide="prev"><i class="fa fa-angle-left"></i><span
          class="sr-only">Previous</span></a>
      <a class="right carousel-control" href="#bootcarousel" data-slide="next"><i class="fa fa-angle-right"></i><span
          class="sr-only">Next</span></a>
    </div>
  </div>
  <!-- End Banner -->
  <!-- Start About    ============================================= -->
  <div class="about-area default-padding">
    <div class="container">
      <div class="row">
        <div class="col-md-8 col-md-offset-2">
          <div class="site-heading text-center">
            <h2>名医 <span>咨询</span></h2>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="about-items">
          <div class="col-md-5 text-right">
            <img src="{% static 'assets/img/about-items.png' %}" alt="" class="img">
          </div>
          <div class="col-md-7">
            <p>汉典中医医院下设汉典医学中心，医学中心包含三大门诊：
                疑难杂病门诊、中医综合门诊、中医调养门诊。其中疑难杂
                病门诊是专门从事疑难杂病的研究及诊疗，拥有从国医大师、
                名医传承工作室专家等全国名老中医到青年中医医师的丰富人
                才梯队数十人，涉及9 大学科，以满足不同患者的就医需求。
            </p>
            <p><a href="{% url 'user:famous' %}">了解详情</a></p>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- End About -->
  <!-- Start Why Chose Us     ============================================= -->
  <div class="chose-us-area item-half">
      <div class="container-full">
        <div class="row">
          <div class="col-md-6 info">
            <div class="heading">
              <h2>医学<span style="color: #a40000;">中心</span></h2>
              <p>医学中心是汉典制药为医疗工作者、中医药行业工作者及爱好者定制的医学专业平台，您可以享受全方位、一站式医学专业服务：</p>
                <p>文献下载：提供文献下载平台，方便医疗工作者自由检索</p>
                <p>文献查询：汉典集团已上市药品文献汇总</p>
                <p>汉典产品：汉典集团已上市药品的相关信息查询</p>
                <p>汉典大学：权威专家中医药相关视频课程</p>
                <p>智能问诊：汇聚常见症状及相关数据，根据病症相关词，筛选和推送个性化信息</p>
                <p>资讯报道：医学发展前沿信息、中医药政策动态，医学学术会议的报道</p>
                <p>中医药典：方便查询，保证用药安全</p>
            </div>
            <ul>
              <li>
                <div class="info">
                  <i><img src="{% static 'assets/img/chose-us-area-icon-a.png' %}" alt=""></i>
                  <h4>国家专利技术</h4>
                </div>
              </li>
              <li>
                <div class="info">
                  <i><img src="{% static 'assets/img/chose-us-area-icon-b.png' %}" alt=""></i>
                  <h4>远程会诊</h4>
                </div>
              </li>
              <li>
                <div class="info">
                  <i><img src="{% static 'assets/img/chose-us-area-icon-c.png' %}" alt=""></i>
                  <h4>医学中心</h4>
                </div>
              </li>
              <li>
                <div class="info">
                  <i><img src="{% static 'assets/img/chose-us-area-icon-d.png' %}" alt=""></i>
                  <h4>云课堂</h4>
                </div>
              </li>
            </ul>
          </div>
          <div class="col-md-6 thumb bg-cover" style="background-image: url({% static 'assets/img/chose-us-area.png' %}); background-position-x: 170px; background-repeat: no-repeat;"></div>
        </div>
      </div>
    </div>
    <!-- End Why Chose Us -->
    <!-- Start Services     ============================================= -->
  <div class="services-area inc-icon bg-light carousel-shadow default-padding">
    <div class="container">
      <div class="row">
        <div class="col-md-8 col-md-offset-2">
          <div class="site-heading text-center">
            <h2>产品与 <span>服务</span></h2>
                {% if product %}
                    {{ product.type_info | safe }}
                {% endif %}
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-md-12">
          <div class="services-items text-center services-carousel owl-carousel owl-theme">
            {% for data in data_list %}
                <div class="item">
                  <div class="info">
                    <h4><a href="{% url 'user:product-all' data.id %}">{{ data.name }}</a></h4>
                    <div class="overlay" style="text-align: center;">
                      <img src="{{ data.img }}" alt="" height="250px">
                    </div>
                    <p style="overflow:hidden; text-overflow: ellipsis; height: 2em; white-space: nowrap;">{{ data.main }}</p>
                    <a class="btn btn-theme border circle btn-md" href="{% url 'user:product-all' data.id %}">了解详细</a>
                  </div>
                </div>
            {% endfor %}
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- End Services -->
{% endblock content %}

{% block js %}
<!-- <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet" /> -->
<!-- <link href="https://fonts.googleapis.com/css?family=Poppins:300,500,600,700,800" rel="stylesheet" /> -->
<script src="{% static 'assets/js/main.js' %}"></script>
{% endblock js %}
